<script setup>
import { ref, defineEmits } from 'vue';

const { question, index } = defineProps(["question", "index"]);
const emit = defineEmits(['select'])


// 选择的值
const select = ref(null)

function handleChange(e) {
  let prefix = e;
  // emit.select()
  emit('select', { id: question.id, answer: prefix, index })
}

// 

</script>

<template>
  <div class='question-item-container'>
    <h2>{{ index + 1 }} {{ question.title }}</h2>
    <div class="items">
      <el-radio-group v-model="select" @change="handleChange">
        <el-radio class="item" v-for="item in question.items" :label="item.prefix">{{ item.prefix }}. {{ item.content
        }}</el-radio>
      </el-radio-group>
    </div>
  </div>
</template>

<style scoped lang="less">
.question-item-container {
  padding: 10px;
}

.el-radio-group {
  display: flex;
  flex-direction: column;
  align-items: start;

}
</style>